{extend name="base" /}
{block name="css"}
<style>
    font {
        color: #cc0000;
    }
</style>
{/block}

{block name="content"}
<!--tab标签-->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-tab layui-tab-brief">
            <ul class="layui-tab-title">
                <li class=""><a href="{:url('admin/dp/expert')}">师资团队</a></li>
                <li class="layui-this">添加师资</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <form class="layui-form" action="{:url('admin/dp/edit_expert')}" method="post">
                        <input type="hidden" name="id" value="{$record.id}">
                        <div class="layui-form-item">
                            <label class="layui-form-label">师资姓名</label>
                            <div class="layui-input-block">
                                <input type="text" name="name" value="{$record.name}" required lay-verify="required" placeholder="请输入专家姓名" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">师资介绍</label>
                            <div class="layui-input-block">
                                <textarea placeholder="请输入介绍" name="desc" class="layui-textarea">{$record.desc}</textarea>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">专家图片</label>
                            <div class="layui-input-block">
                                <button type="button" class="layui-btn" id="uploadBtn">上传图片</button>
                                <div class="layui-upload-list">
                                    <img class="layui-upload-img" id="previewImg" src="/public/{$record.img}" width="100" height="100">
                                    <input type="hidden" name="img" id="img" value="{$record.img}">
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn" lay-submit lay-filter="submitExpertEdit">提交</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}

{block name="js"}
<script>
    layui.use(['form', 'upload'], function(){
        var form = layui.form, upload = layui.upload;

        // 图片上传
        var uploadInst = upload.render({
            elem: '#uploadBtn',
            url: '/index/index/upload', // 替换为实际上传接口
            before: function(obj){
                obj.preview(function(index, file, result){
                    $('#previewImg').attr('src', result);
                });
            },
            done: function(res){
                if(res.code === 1){
                    $('#img').val(res.data.url);
                }
                layer.msg(res.msg);
            },
            error: function(){
                layer.msg('上传失败，请重试');
            }
        });

        // 表单提交（AJAX方式）
        form.on('submit(submitExpertEdit)', function(data){
            $.ajax({
                url: data.form.action,
                type: data.form.method,
                data: $(data.form).serialize(),
                success: function(info){
                    if(info.code === 1){
                        setTimeout(function(){
                            window.location.href = "{:url('admin/dp/expert')}";
                        }, 1000);
                    }
                    layer.msg(info.msg);
                }
            });
            return false;
        });
    });
</script>
{/block}
